<template>
	<view class="member-page">
		<view class="button-sp-area">
			<button @click="addCard()" plain="true">新增</button>
			<button @click="readData()" plain="true">召唤</button>
		</view>
		<view class="addCardView" v-if="addCardFlag">
			<uni-search-bar placeholder="尽量输入全名" v-model="searchName" @confirm="getCard()">
			</uni-search-bar>
		</view>
		<view class="summonView" v-if="summonFlag">
			<img :src="cardImg" style="width:100%" />
		</view>
	</view>
</template>

<script>
	import nfc from '../../js_sdk/cjn-nfc-tool/Android-App-NFC/tool.js'
	export default {
		data() {
			return {
				cardUID: "",
				url: "http://192.168.2.2:3000/cardNFC",
				searchName: "",
				cardLsit: [],
				cardImgBaseFirst: 'https://cdn.233.momobako.com/ygopro/pics/',
				cardImgBaseFinally: ".jpg",
				cardImg: "",
				addCardFlag: false,
				summonFlag: false,
			}
		},
		methods: {
			//添加卡片信息
			addCard() {
				this.summonFlag = false
				this.addCardFlag = true
				uni.showToast({
					title: '功能未实现',
					icon: 'none'
				});
			},
			//搜索卡片信息
			getCard() {
				let _this = this
				uni.request({
					url: "https://ygocdb.com/api/v0/?search=" + _this.searchName,
					method: "GET",
					success(res) {
						console.log("请求成功");
						if (res.statusCode === 200) {
							res.data.result.forEach((e) => {
								e.img = _this.caradImgBaseTop + e.id + _this.caradImgBaseBottom
								console.log(e.img);
							})
							_this.cardLsit = res.data.result

						}
					},
					fail(res) {
						console.log("请求失败");
						console.log(res)
					}
				})
			},
			//向服务器发送nfc卡片信息
			sendCardNFCId(id) {
				let _this = this
				uni.request({
					url: _this.url,
					method: "POST",
					data: {
						cardUID: id
					},
					success(res) {
						console.log(res);
						let cardID = res.data.data
						if (res.statusCode === 200) {
						//请求成功显示卡片
						_this.cardImg = _this.cardImgBaseFirst + cardID + _this.cardImgBaseFinally
						_this.summonFlag = true
						let code = res.data.code
						
							uni.showToast({
								title: '召唤成功',
								icon: 'none'
							});
						console.log("请求成功");
						}else{
							console.log("请求失败");
							console.log(res)
						}

					},
					fail(res) {
						console.log("请求失败");
						console.log(res)
					}
				})
			},
			readData() {
				let _this = this;
				_this.addCardFlag = false
				nfc.nfcGetId({
					success: function(data) {
						//对请求做防抖
						_this.sendCardNFCId(data)
						_this.cardUID = data
					},
					fail: function(err) {

					},
					complete: function() {

					}
				});

			}

		},
		onHide() {
			// #ifdef APP-PLUS
			plus.globalEvent.removeEventListener('newintent', function() {
				//console.log('remove newintent');
			});
			plus.globalEvent.removeEventListener('pause', function(e) {
				//console.log('remove pause');
			});
			plus.globalEvent.removeEventListener('resume', function(e) {
				//console.log('remove resume');
			});
			// #endif
		},
		// 销毁监听事件 避免重新进入页面重复读卡
		beforeDestroy() {
			// #ifdef APP-PLUS 
			plus.globalEvent.removeEventListener('newintent', function() {
				//console.log('remove newintent');
			});
			plus.globalEvent.removeEventListener('pause', function(e) {
				//console.log('remove pause');
			});
			plus.globalEvent.removeEventListener('resume', function(e) {
				//console.log('remove resume');
			});
			// #endif
		}

	}
</script>
<style scoped>
	.button-sp-area {
		margin-top: 40px;
		display: flex;
	}

	.addCardView {
		margin-top: 40px;
	}

	.summonView {
		margin-top: 40px;
		padding: 0 40px;
		display: flex;
		justify-content: center;
	}
</style>